<template>
	<!-- 标题 -->
	<div class="component-item">
		<div class="title-diy"
			 :style="{'background': item.bgColor, 'border-radius': item.bgStyle == 'circle' ? '6px' : '0px', 'margin-top': item.pageMargin + 'px', 'padding-left': item.bgMargin + 'px', 'padding-right': item.bgMargin + 'px'}">
			<div class="title-content"
				 :style="{'color': item.fontColor, 'font-size': item.fontSize + 'px', 'text-align': item.textAlign}">
				{{ item.content }}
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		name: "cTitle",
		props: {
			item: {
				type: Object,
				default() {
					return {}
				}
			}
		},
		data() {
			return {
				
			}
		},
		mounted() {
			
		},
		methods: {
			
		}
	}
</script>

<style scoped>
.title-diy {
    width: 100%;
    height: 28px;
}
.title-content {
    padding: 5px 10px;
    font-size: 12px;
}	
</style>